import Vue from 'vue'
import App from './App.vue'
//import router from './router/index.js'
import routes from './router/routes.js';
import store from './store'
import VueRouter from 'vue-router'

//重置css
import 'normalize.css/normalize.css';

//引入全局通用组件
import myComponents from './components/overall/overall.js';
Object.keys(myComponents).forEach(k => Vue.component(k, myComponents[k]));

//引入函数式组件：loading
import Loading from './components/functionCom/loading/loading.js';
Vue.use(Loading);

//引入中央事件总线
import { Emit } from './plugins/emit/emit.js'
Vue.prototype.Emit = Emit;

//引入自定义指令
import * as directives from './plugins/directives/index.js';
Object.keys(directives).forEach(k => Vue.directive(k, directives[k]));

//引入自定义过滤器
import * as filters from './plugins/filter/index.js';
Object.keys(filters).forEach((key) => {
    Vue.filter(key, filters[key]);
});

///引入公有方法，使用 this.$util.xxx
import * as methods from './util/index.js';
Object.keys(methods).forEach(k => {
    Vue.prototype[k] = methods[k]
});

//按需引入element
import './plugins/element.js';

Vue.config.productionTip = false;

let instance = null
function render (props = {}) {
  const { container, routerBase } = props
  const router = new VueRouter({
    base: window.__POWERED_BY_QIANKUN__ ? routerBase : "vue-app",
    mode: 'history',
    routes
  })

  instance = new Vue({
    router,
    store,
    render: (h) => h(App)
  }).$mount(container ? container.querySelector('#app') : '#app')
}

if (!window.__POWERED_BY_QIANKUN__) {
  render()
}

export async function bootstrap () {
  console.log('[vue] vue app bootstraped')
}

export async function mount (props) {
  console.log('[vue] props from main framework', props)

  render(props)
}

export async function unmount () {
  instance.$destroy()
  instance.$el.innerHTML = ''
  instance = null
}